<template>
  <div class="app-container">
    <el-form ref="form" :model="form" :rules="rules" size="small" label-width="150px">
      
      <el-form-item label="APPID" prop="ali_pay_appid">
        <el-input v-model="form.ali_pay_appid" placeholder="请输入APPID"/>
      </el-form-item>
      <el-form-item label="支付宝私钥" prop="ali_pay_private_key">
        <el-input v-model="form.ali_pay_private_key" type="password" placeholder="请输入支付宝私钥"/>
      </el-form-item>
      <el-form-item label="服务器异步通知地址" prop="ali_pay_notifu_url">
        <el-input v-model="form.ali_pay_notifu_url" placeholder="请输入服务器异步通知地址"/>
      </el-form-item>
      <el-form-item label="跳转同步通知路径" prop="ali_pay_return_url">
        <el-input v-model="form.ali_pay_return_url" placeholder="请输入页面跳转同步通知页面路径"/>
      </el-form-item>
      <el-form-item label="付款中途退出地址" prop="ali_pay_quit_url">
        <el-input v-model="form.ali_pay_quit_url" placeholder="请输入用户付款中途退出返回商户网站的地址"/>
      </el-form-item>
      <el-form-item label="支付宝公钥" prop="ali_pay_public_key">
        <el-input v-model="form.ali_pay_public_key" type="password" placeholder="请输入支付宝公钥"/>
      </el-form-item>
      <el-form-item label="支付宝公钥2" prop="ali_pay_public_key2">
        <el-input v-model="form.ali_pay_public_key2" type="password" placeholder="请输入支付宝公钥2"/>
      </el-form-item>
      <el-form-item label="支付宝开关" prop="ali_pay_is_open">
        <el-radio v-model="form.ali_pay_is_open" :label="1">开启</el-radio>
        <el-radio v-model="form.ali_pay_is_open" :label="2">关闭</el-radio>
      </el-form-item>
      <el-form-item label="">
        <el-button type="primary" @click="doSubmit('form')">提交</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import checkPermission from '@/utils/permission'
import initData from '@/mixins/crud'
import { del, add, get } from '@/api/yxSystemConfig'
import eForm from './form'
import picUpload from '@/components/pic-upload'
import { Message } from 'element-ui'
export default {
  components: { eForm, picUpload },
  mixins: [initData],
  data() {
    return {
      delLoading: false,
      form: {
        ali_pay_appid: '',
        ali_pay_private_key: '',
        ali_pay_notifu_url: '',
        ali_pay_return_url: '',
        ali_pay_quit_url: '',
        ali_pay_public_key: '',
        ali_pay_public_key2: '',
        ali_pay_is_open: 1
        
      },
      rules: {
        ali_pay_appid: [
            { required: true, message: '请输入APPID', trigger: 'blur' }
        ],
        ali_pay_private_key: [
            { required: true, message: '请输入支付宝私钥', trigger: 'blur' }
        ],
        ali_pay_notifu_url: [
            { required: true, message: '请输入服务器异步通知地址', trigger: 'blur' }
        ],
        ali_pay_return_url: [
            { required: true, message: '请输入页面跳转同步通知页面路径', trigger: 'blur' }
        ],
        ali_pay_quit_url: [
            { required: true, message: '请输入用户付款中途退出返回商户网站的地址', trigger: 'blur' }
        ],
        ali_pay_public_key: [
            { required: true, message: '请输入支付宝公钥', trigger: 'blur' }
        ],
        ali_pay_public_key2: [
            { required: true, message: '请输入支付宝公钥2', trigger: 'blur' }
        ],
        ali_pay_is_open: [
            { required: true, message: '支付宝开关', trigger: 'blur' }
        ],
      }
    }
  },
  created() {
    get().then(rese => {
      const that = this;
      rese.content.map(function(key, value) {
        const keyName = key.menuName
        const newValue = key.value
        if(keyName in that.form){
          that.form[keyName] = newValue
        }
      })

      this.form.ali_pay_is_open = parseInt(this.form.ali_pay_is_open)
    })
  },
  methods: {
    checkPermission,
    doSubmit(formName) {
      this.$refs[formName].validate((valid) => {
          if (valid) {
            add(this.form).then(res => {
              Message({ message: '设置成功', type: 'success' })
            }).catch(err => {
              // this.loading = false
              console.log(err.response.data.message)
            })
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      
    }

  }
}
</script>

<style scoped>

</style>
